$(document).ready(function() {
	var box = $('.box');

	$('#wrapper').on({
		mouseover : function() {
			var tg = $(this);
			tg.removeClass().addClass('box over');
			tg.find('> p').text('mouseover');
		},
		mouseout : function() {
			var tg = $(this);
			tg.removeClass().addClass('box out');
			tg.find('> p').text('mouseout');
		},
		click : function() {
			var tg = $(this);
			tg.removeClass().addClass('box click');
			tg.find('> p').text('click');
		}
	}, '.box');

	$('#nav > :input').bind('click', function() {
		$('#wrapper').append(box.eq(0).clone());
	});
});